<template>
  <div class="view-fill">
    <div v-if="!showModify.visible" class="app-container-flex">
      <NewFullScreen
        v-model="showDialog"
        title="用前检查记录详情"
        :btn-list="btnList"
        :needOperateAffair="true"
        :operateAffairData="affairTableInfo"
        @returnBack="returnBack"
      >
        <div class="model-panel">
          <div class="model-panel-title">
            <p>{{ $t('basic_information') }}</p>
          </div>
          <div class="model-panel-body">
            <basic-information :info="formInfo">
              <template v-slot:basic-filePathList>
                <span v-if="formInfo.data.filePathList">
                  <eleGallery
                    :lazy="true"
                    :size="150"
                    :source="formInfo.data.filePathList"
                    title="附件"
                  ></eleGallery>
                </span>
                <span v-else>-</span>
              </template>
            </basic-information>
          </div>
        </div>
      </NewFullScreen>
    </div>
    <!-- 新增或修改 -->
    <modify
      v-if="showModify.visible"
      :id="id"
      v-model:visible="showModify.visible"
      v-model:title="showModify.title"
      :type="showModify.type"
      @returnModify="modifyCallback"
    />
  </div>
</template>

<script setup name="assetDictDetails">
import utils from '@/common/js/utils' // 公共方法
import Modify from './modify'
import { getInspectionRecordById } from '@/api/quality'
import { orderOpAffairAll } from '@/api/affair'
import eleGallery from '@/components/UploadImg/eleGallery'
const emits = defineEmits()
const { proxy } = getCurrentInstance()
const props = defineProps({
  visible: {
    type: Boolean,
    default: false,
  },
  id: {
    type: [String, Number],
  },
})
const formInfo = reactive({
  ref: null,
  data: {},
  fieldList: [
    {
      label: '记录单号',
      value: 'orderNo',
    },
    {
      label: '合同编号',
      value: 'contractNo',
    },
    {
      label: '使用部门',
      value: 'deptName',
    },
    {
      label: '安装日期',
      value: 'installDate',
    },
    {
      label: '安装地点',
      value: 'installLocation',
    },
    {
      label: '产品名称',
      value: 'productName',
    },
    {
      label: '规格',
      value: 'standard',
    },
    {
      label: '生产厂家',
      value: 'brandName',
    },
    {
      label: '生产日期',
      value: 'productionDate',
    },
    {
      label: '批号',
      value: 'batchNumber',
    },
    {
      label: '供应商',
      value: 'supplierName',
    },
    {
      label: '供应商电话',
      value: 'supplierPhone',
    },
    {
      label: '售后电话',
      value: 'supportPhone',
    },
    {
      label: '包装情况',
      value: 'packagingTypeValue',
    },
    {
      label: '器械情况',
      value: 'conditionTypeValue',
    },
    {
      label: '注册证号',
      value: 'regCerNo',
    },
    {
      label: '检查结果',
      value: 'inspectionResultValue',
    },
    {
      label: '检查人',
      value: 'inspectorName',
    },
    {
      label: '检查日期',
      value: 'inspectorDate',
    },
    {
      label: '资产',
      value: 'assetName',
    },
    { label: '创建人', value: 'createUserName' },
    { label: '创建时间', value: 'createTime' },
    {
      label: '附件',
      value: 'filePathList',
      type: 'slot',
      className: 'not-br',
    },
  ],
  labelWidth: '120px',
})
const btnList = reactive([
  {
    label: '修改',
    event: update,
    show: proxy.$permission('inspectionRecord:update'),
  },
])
// 操作流水
const affairTableInfo = reactive({
  api: orderOpAffairAll,
  query: {
    orderType: 100,
    orderId: props.id,
    sort: 'operate_time desc',
  },
})
const showModify = reactive({
  title: '修改用前检查记录',
  type: 'update',
  visible: false,
})
const showDialog = computed({
  get() {
    return props.visible
  },
  set(newValue) {
    emits('update:visible', newValue) // 更新父组件visible
  },
})
watch(
  () => props.visible,
  (newVal) => {
    showDialog.value = newVal
  },
  {
    immediate: true,
  }
)
onMounted(() => {
  getDeatil()
})

function returnBack() {
  emits('returnBack')
}
function getDeatil() {
  getInspectionRecordById(props.id).then((resp) => {
    if (resp && resp.success) {
      formInfo.data = resp.data
      if (formInfo.data.filePath) {
        formInfo.data.filePathList = utils.splitArr(formInfo.data.filePath)
      }
    }
  })
}
function update() {
  showModify.visible = true
}
function modifyCallback() {
  getDeatil()
}
</script>

<style scoped></style>
